<script lang="ts" setup>
import { createViewer } from '@utils/cesium';
import type { Viewer } from 'cesium';
import { useViewerStore } from '@/store';

const store = useViewerStore();
const viewerRef = ref<HTMLElement>();
let viewer: Viewer;

onMounted(() => {
  viewer = createViewer(viewerRef.value!);
  store.setViewer(viewer);
});
</script>

<template>
  <div ref="viewerRef" class="viewer-container" />
</template>

<style scoped>
.viewer-container {
  height: 100%;
}
</style>
